<template>
  <a-modal
    title="修改价格"
    :width="1200"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleSubmit"
    :okButtonProps="{ props: { disabled: disableSubmit } }"
    @cancel="handleCancel"
    cancelText="关闭"
    style="top: 20px"
  >
    <a-spin :spinning="confirmLoading">
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        @change="handleTableChange">

        <div slot="price" slot-scope="price, row">
          <a-input-number
            id="inputNumber1"
            :value="price"
            :min="0"
            @change="onChangePrice($event, row)"
            :precision="2"
            :disabled="row.orderProductType == 1"
          />
        </div>
      </a-table>
    </a-spin>
  </a-modal>
</template>

<script>
import pick from "lodash.pick";
import {httpAction, postAction, putAction} from "@/api/manage";
import {getAction} from "@/api/manage";
import {JeecgListMixin} from '@/mixins/JeecgListMixin'

export default {
  name: "StmChannelEditProductPrice",
  mixins: [JeecgListMixin],

  data() {
    return {
      visible: false,
      confirmLoading: false,
      isChanged: false,
      disableSubmit: false,
      model: {},
      applyId: null,
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '申请Id',
          align: "center",
          dataIndex: 'id'
        },
        {
          title: '商品名称',
          align: "center",
          dataIndex: 'productName'
        },
        {
          title: '货号',
          align: "center",
          dataIndex: 'productSn'
        },
        {
          title: '物料编码',
          align: "center",
          dataIndex: 'skuCode'
        },
        {
          title: '价格',
          align: "center",
          dataIndex: 'price',
          scopedSlots: {customRender: "price"},
        },

        {
          title: '生效日期',
          align: "center",
          dataIndex: 'beginTime'
        }
      ],
      dataSource: [],
      labelCol: {
        xs: {span: 24},
        sm: {span: 8},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 13},
      },
      form: this.$form.createForm(this),
      url: {
        edit: "/stm/stmChannelProductApplyItem/editItemPrice",
        list: "/stm/stmChannelProductApplyItem/list",
      },
      loading: false,
    };
  },
  computed: {},
  methods: {
    loadData(arg) {
      if (arg === 1) {
        this.ipagination.current = 1
      }
      if (this.applyId == null) {
        return;
      }
      var params = this.getQueryParams()
      getAction(this.url.list, {
        applyId: this.applyId,
        pageNo: this.ipagination.current,
        pageSize: this.ipagination.pageSize
      }).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records.map((x) => {
            return {
              price_old: x.price,
              ...x,
            };
          });
          // this.dataSource = res.result.records
          this.ipagination.total = res.result.total
        } else {
          this.dataSource = null
        }
      })
    },
    getMain(id) {
      this.dataSource = [];
      this.applyId = id;
      this.visible = true;
      this.loadData(1)
    },
    onChangePrice(event, row) {
      row.price = event;
    },
    close() {
      this.form.resetFields();
      this.$emit("close");
      this.visible = false;
    },
    handleSubmit() {
      this.confirmLoading = true;
      let itemMap = [];
      this.dataSource.forEach((row) => {
        const {price, id,applyId} = row;
        if (
          price != row.price_old
        ) {
          itemMap.push({
            price,
            id,
            applyId
          });
        }
      });
      let formData = {
        itemMap
      };
      putAction(this.url.edit, itemMap)
        .then((res) => {
          if (res.success) {
            this.$message.success(res.message);
            this.$emit("ok");
          } else {
            this.$message.warning(res.message);
          }
        })
        .finally(() => {
          this.confirmLoading = false;
          this.close();
        });

      this.confirmLoading = false;
    },
    handleCancel() {
      this.close();
    },
    handleTableChange(pagination, filters, sorter) {
      //分页、排序、筛选变化时触发
      //TODO 筛选
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field;
        this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
      }
      this.ipagination = pagination;
      this.loadData();
    },
    handleToggleSearch() {
      this.toggleSearchStatus = !this.toggleSearchStatus;
    },
    // 给popup查询使用(查询区域不支持回填多个字段，限制只返回一个字段)
    getPopupField(fields) {
      return fields.split(',')[0]
    },
    modalFormOk() {
      // 新增/修改 成功时，重载列表
      this.loadData();
    },
  },
};
</script>
